{% extends ../base.html %}

{% block body %}

<div class="col-md-12">
    <h3>说明</h3>
    <p>本工具完全基于浏览器</p>
</div>

<div class="col-md-6">
    <h3>Input</h3>
    <textarea id="input" class="col-md-12" rows="20"></textarea>
    <button onclick="run()">Run</button>
</div>
<div class="col-md-6">
    <h3>Output</h3>
    <pre id="output" class="col-md-12"></pre>
    <div id="error" class="col-md-12" style="color: red;"></div>
</div>

<div class="col-md-12">
    <h3>函数说明</h3>
    <p><code>print(msg)</code>输出结果</p>
    <p><code>println(msg)</code>输出换行结果</p>
    <p><code>dir(obj)</code>查看对象属性</p>
</div>

<script type="text/javascript">
    function isBasicType(obj) {
        var typeName = typeof(obj);
        // 不能随便换行
        return typeName == "string" || typeName == "number" || typeName == "boolean"
    }
    function print(msg) {
        $("#output").text($("#output").text() + msg);
    }
    function println(msg) {
        if (msg==undefined) {
            msg="";
        }
        print(msg+"\n")
    }

    function dir(obj) {
        println("type:" + typeof(obj));
        println("toString:" + obj.toString());

        if (isBasicType(obj)) {
            println();
            return;
        }

        println("=================================================");

        println("[");
        for (var key in obj) {
            var value = obj[key];
            println("  " + key + ":" + typeof(value));
        }
        println("]");
        println();
    }

    function run() {
        var input = $("#input").val();
        // eval接受一个参数string,eval会改变window对象
        // eval(string)
        try {
            $("#error").text("");
            $("#output").text("");
            var output = eval(input);
            // $("#output").text(output);
        } catch (e) {
            $("#error").text(e);
        }
    }
</script>

{% end %}